<template>
    <div  class="v-application v-application--is-ltr theme--light"  style="margin:-8px;padding:0; border: 0;">
        <div class="v-application--wrap">
<header  class="v-sheet theme--light v-toolbar v-toolbar--flat v-app-bar v-app-bar--fixed nav" data-booted="true" style="height: 60px; margin-top: 0px; transform: translateY(0px); left: 0px; right: 0px;">
<div class="v-toolbar__content" style="height: 60px;">
    <div  class="d-md-none nav-mobile-container"><div  style="font-size: 18px; font-weight: bold;"><a href="/front/myVue%20-%20副本/static" class="router-link-active"> 菠萝刺头 </a></div><div style="margin-left: auto;"><a ><i class="iconfont iconsousuo"><i class="el-icon-search"></i></i></a><a style="margin-left: 10px; font-size: 20px;"><i class="iconfont iconhanbao">首页</i></a></div></div>
</div>
</header>
<main class="v-main v-content" data-booted="true" style="padding: 60px 0px 136px;">
<div class="v-main__wrap v-content__wrap">
<div >
    <div  class="banner" style="background: url(&quot;http://blogcnt.oss-cn-hangzhou.aliyuncs.com/config/0d733fef1d444cef746d0881e73ce28a.jpg&quot;) center center / cover no-repeat;"><h1  class="banner-title">个人中心</h1></div>
    <div  class="blog-container v-card v-sheet theme--light">
<div ><span  class="info-title">基本信息</span></div>
<div  class="row info-wrapper">

</div>
    </div>
</div>
</div>
</main>
        </div>
    </div>
</template>
<style scoped>
.row {
    flex-wrap: wrap;
    flex: 1 1 auto;
    margin: -12px;
}
.info-wrapper {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.info-title {
    font-size: 1.25rem;
    font-weight: 700;
}
.v-card:not(.v-sheet--tile):not(.v-card--shaped) {
        border-width: thin;
    display: block;
    outline: none;
    text-decoration: none;
    box-shadow: 0 4px 8px 6px rgba(7,17,27,.06)!important;
    transition: all .3s;
        color: #4c4948;
        border-radius: 4px;
    overflow-wrap: break-word;
    position: relative;
    white-space: normal;
}
.blog-container {
        animation: main 1s;
    max-width: 970px;
    padding: 50px 40px;
    margin: 245px auto 40px auto;
    background: #fff!important;
}
.v-toolbar {
    contain: layout;
    display: block;
    flex: 1 1 auto;
    max-width: 100%;}
.v-toolbar--flat {
    box-shadow: 0 0 0 0 rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.14),0 0 0 0 rgba(0,0,0,.12)!important;
}
.v-app-bar--fixed {
    position: fixed;
    top: 0;
    z-index: 5;
}
.banner-title {
    position: absolute;
    top: 5.5rem;
    width: 100%;
    font-size: 1.625rem;
    text-align: center;
    color: #eee;
    animation: title-scale 1s;
}
.banner {
        position: absolute;
    background-color: #49b1f5!important;
    top: -60px;
    left: 0;
    right: 0;
    height: 278px;
    animation: header-effect 1s;
}
.v-main__wrap {
    flex: 1 1 auto;
    max-width: 100%;
    position: relative;
}
.v-main {
    display: flex;
    flex: 1 0 auto;
    max-width: 100%;
    transition: .2s cubic-bezier(.4,0,.2,1);
}
:after, :before {
    text-decoration: inherit;
    vertical-align: inherit;
}
*, :after, :before {
    background-repeat: no-repeat;
    box-sizing: inherit;
}
.iconfont {
    color: rgb(255, 255, 255);
    font-family: iconfont!important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
margin-right: 4px;
}
.router-link-active{
        color: rgb(255, 255, 255);
        text-decoration: none;
        cursor: pointer;
            background-color: transparent;
}
.nav-mobile-container {
    width: 100%;
    display: flex;
    align-items: center;
}
.v-toolbar__content{
    padding: 0px 16px;
    align-items: center;
    display: flex;
    position: relative;
    z-index: 0;
}
.v-sheet {
    border-color: #fff;
    color: rgba(0,0,0,.87);
}
.nav{
    background: transparent!important;
}
.v-application--wrap {
    flex: 1 1 auto;
    backface-visibility: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    max-width: 100%;
    position: relative;
}
.theme--light{
        background: linear-gradient(90deg,rgba(247,149,51,.1),rgba(243,112,85,.1) 15%,rgba(239,78,123,.1) 30%,rgba(161,102,171,.1) 44%,rgba(80,115,184,.1) 58%,rgba(16,152,173,.1) 72%,rgba(7,179,155,.1) 86%,rgba(109,186,130,.1));
    color: #4c4948;
}
.v-application {
    /* margin: -7;
    padding: 0; */
    display: flex;
    position: relative;
    line-height: 1.5;
    background: linear-gradient(90deg,rgba(247,149,51,.1),rgba(243,112,85,.1) 15%,rgba(239,78,123,.1) 30%,rgba(161,102,171,.1) 44%,rgba(80,115,184,.1) 58%,rgba(16,152,173,.1) 72%,rgba(7,179,155,.1) 86%,rgba(109,186,130,.1));
    color: #4c4948;
}
</style>
